<template>
	<view class="menu-box left clearfix">
		<view class="menu-breadcrumb left clearfix">
			<uni-breadcrumb separator="/" style="width:300px;float:left;">
			  <uni-breadcrumb-item v-for="(route,index) in routes" :key="index" :to="route.to">
			    {{route.name}}
			  </uni-breadcrumb-item>
			</uni-breadcrumb>
			<view class="add-bottons right" @click="navigateToPage('news-add')">
				新增
			</view>
		</view>
		
		<view class="menu-content left clearfix">
			<view class="menu-table left clearfix">
				<!--头部-->
				<view class="menu-tr left clearfix" style="font-weight:bold;color:#909399">
					<view class="menu-sort left" style="width:50px;">
						序号
					</view>
					<view class="menu-title left" style="padding-left:10px;">
						标题
					</view>
					
					
					<view class="menu-title left" style="width:100px;">
						作者
					</view>
					<view class="menu-title left" style="width:70px;">
						浏览量
					</view>
					<view class="menu-title left" style="width:100px;">
						展示
					</view>
					<view class="menu-title left" style="width:200px;">
						发布时间
					</view>
					<view class="menu-title left" style="width:150px;border-right:none;">
						操作
					</view>
				</view>
				
				
				
				
				<view  v-for="(item,index) in data">
				<view class="menu-tr left clearfix" style="color:#606266;">
					<view class="menu-sort left" style="width:50px;">
						{{index + 1}}
					</view>
					<view class="menu-title left" style="text-align: left;padding-left:10px;font-weight:500;">
						<label>
							<uni-icons :type="item.icon" size="15" color="#666" custom-prefix="iconfont"></uni-icons>
						</label>
						<label>
							 {{item.title}}
						</label>
						
					</view>
					
					<view class="menu-title left" style="width:100px;">
						{{item.name}}
					</view>
					<view class="menu-title left" style="width:70px;">
						{{item.click}}
					</view>
					<view class="menu-title left" style="width:100px;text-align: center;">
						<label v-if="item.is_show==false" style="color:#ccc;width:100px;float:left;text-align: center;">
							--
						</label>
						<label v-else-if="item.is_show==true" style="width:100px;float:left;text-align: center;">
							<uni-icons type="icon-duigou3" size="16" color="#00c296" custom-prefix="iconfont"></uni-icons>
						</label>
					</view>
					
					<view class="menu-title left" style="width:200px;">
						<uni-dateformat :date="item.create_date"></uni-dateformat>
					</view>
					
					<view class="menu-title left" style="width:150px;border-right:none;">
						
						
						<view class="buttons left" @click="navigateToPage('news-add',item._id)">
							修改
						</view>
						
						<view class="buttons-del left" @click="remove(item,index)">
							删除
						</view>
						
					</view>
					
					
					
				</view>
				
				
			</view>
				
				
				
				
				
				
				
			</view>
		</view>
	</view>
</template>


<style scoped lang="scss">
	.menu-title label{float:left;margin-right:5px;}
	.menu-title{width:calc(100% - 700px);height:45px;border-right:1px solid #eee;line-height:45px;text-align:center;font-size:14px;}
	.menu-sort{width:100px;height:45px;line-height:45px;text-align:center;font-size:14px;border-right:1px solid #eee;}
	.menu-tr:hover{background:#f8f8f8;}
	.menu-tr{width:100%;height:45px;border-bottom:1px solid #eee;}
	.menu-table{width:100%;border:1px solid #eee;border-bottom:none;}
</style>

<script>
	var db = uniCloud.database();
	export default {
		name:"system-menu",
		data() {
			return {
				data:[],
				routes: [
				        {
				          to: "/A",
				          name: "新闻管理",
				        },
				        {
				          to: "/B",
				          name: "新闻列表",
				        }
				      ],
			};
		},
		mounted() {
			this.getData();
		},
		methods:{
			//删除
			remove(item,index,children=false){
				var that = this;
				uni.showModal({
					title: '提示',
					content: '确定要删除吗？',
					success: function (res) {
						if (res.confirm) {
							db.collection('news').where({_id:item._id}).remove().then(res=>{
								that.data.splice(index,1);
							});
						}
					}
				});
			},
			//获取列表
			getData(){
				uni.showLoading({
					title:'加载中'
				})
				db.collection('news').orderBy('create_date desc').get().then(res=>{
					console.log('获取结果',res);
					uni.hideLoading();
					this.data = res.result.data;
				}).catch(err=>{
					uni.hideLoading();
				});
			},
			//新增菜单
			navigateToPage(item,id,children=false,cid=false,newAdd=false){
				var page = '/pages/index/index?page='+item+'&id='+id;
				if(children!=false){
					page = page+'&children=y'
				}
				if(cid!=false){
					page = page+'&childrenId='+cid
				}
				
				if(newAdd!=false){
					page = page + '&newAdd='+newAdd
				}
				console.log('page',page);
				uni.navigateTo({
					url:page
				})
				
				
			}
		}
	}
</script>
